<script setup>
defineProps({
  width: {
    type: String,
    default: '100%'
  },
  height: {
    type: String,
    default: '100%'
  }
})
</script>

<template>
  <svg :width="width" :height="height" viewBox="0 0 64 64"
       xmlns="http://www.w3.org/2000/svg">
    <circle cx="32" cy="32" fill="#77b3d4" r="32"/>
    <path d="m52 44c0 2.2-1.8 4-4 4h-32c-2.2 0-4-1.8-4-4v-20c0-2.2 1.8-4 4-4h32c2.2 0 4 1.8 4 4z" fill="#231f20"
          opacity=".2"/>
    <path d="m52 42c0 2.2-1.8 4-4 4h-32c-2.2 0-4-1.8-4-4v-20c0-2.2 1.8-4 4-4h32c2.2 0 4 1.8 4 4z" fill="#e0e0d1"/>
    <path
        d="m35.5 30.2c-1.9-2.1-5.1-2.1-7 0l-15.5 13c-.2.2-.3.4-.5.6.7 1.3 2 2.2 3.4 2.2h32c1.5 0 2.7-.9 3.4-2.2-.1-.2-.3-.4-.5-.6z"
        fill="#231f20" opacity=".2"/>
    <path
        d="m35.5 32c-1.9-1.9-5.1-1.9-7 0l-15.5 11.5c-.2.2-.3.3-.5.5.7 1.2 2 1.9 3.4 1.9h32c1.5 0 2.7-.8 3.4-1.9-.1-.2-.3-.3-.5-.5z"
        fill="#e0e0d1"/>
    <path d="m12.6 20.2c.7-1.3 2-2.2 3.4-2.2h32c1.5 0 2.7.9 3.4 2.2-.1.2-.3.4-.5.6l-15.4 13c-1.9 2.1-5.1 2.1-7 0z"
          fill="#231f20" opacity=".2"/>
    <path
        d="m28.5 32c1.9 1.9 5.1 1.9 7 0l15.5-11.5c.2-.2.3-.3.5-.5-.7-1.2-2-1.9-3.4-1.9h-32.1c-1.5 0-2.7.8-3.4 1.9.1.2.3.3.5.5z"
        fill="#fff"/>
  </svg>
</template>
